<template>
	<!-- 预约详情 -->
	<view class="page boxAll themeBga">
		<!-- 步骤条 -->
		<view class="stepsBox themeMask mt20">
			<uv-steps current="0" activeColor="#75301e" inactiveColor="#75301e">
				<uv-steps-item class="flexColumn alignCenter">
					<template v-slot:title>
						<text class="fz28 mb10">已提交</text>
					</template>
					<template v-slot:desc>
						<text class="fz20">2024-05-20 13:14</text>
					</template>
				</uv-steps-item>
				<uv-steps-item class="flexColumn alignCenter">
					<template v-slot:title>
						<text class="fz28 mb10">等待商家确认</text>
					</template>
					<template v-slot:desc>
						<text class="fz20">2024-05-20 13:14</text>
					</template>
				</uv-steps-item>
				<uv-steps-item class="flexColumn alignCenter">
					<template v-slot:title>
						<text class="fz28 mb10">预约成功</text>
					</template>
					<template v-slot:desc>
						<text class="fz20">2024-05-20 13:14</text>
					</template>
				</uv-steps-item>
			</uv-steps>
		</view>
		<!-- 预约信息 -->
		<view class="mackInfo themeMask fz28 mt20">
			<view class="borderBtm20">预约信息</view>
			<view class="flex justifyBetween mb20">
				<view>就餐人数</view>
				<view class="darkgray">4人</view>
			</view>
			<view class="flex justifyBetween mb20">
				<view>预计到店时间</view>
				<view class="darkgray">2024-05-20 13:14</view>
			</view>
			<view class="flex justifyBetween mb20">
				<view>预约编号</view>
				<view class="darkgray">216545678512154</view>
			</view>
			<view class="flex justifyBetween mb20">
				<view>预计时间</view>
				<view class="darkgray">2024-05-20 13:14</view>
			</view>
			<view class="flex justifyBetween mb20">
				<view>商家是否确认</view>
				<view class="darkgray">-</view>
			</view>
			<view class="flex justifyBetween">
				<view>桌号</view>
				<view class="darkgray">-</view>
			</view>
		</view>
		<!-- 广告位 -->
		<view></view>
	</view>
</template>

<script setup>

</script>

<style lang="scss" scoped>
	// 步骤条
	.stepsBox {
		padding: 34rpx 0;
	}

	// 预约信息
	.mackInfo {
		padding: 24rpx;
	}
</style>